$(function () {
    var editCategoryData;
    var parentCategory = '无';
    var parentId = 0; // 变化的，用于显示
    var categoryLevel = 1;
    const firstParentId = 0; // 第一级分类的父id

    $('#jqGrid').jqGrid({
        colModel: [
            {label: 'id', name: 'categoryId', key: true, hidden: true},
            {label: '父id', name: 'parentId', hidden: true},
            {label: '分类级别', name: 'categoryLevel', width: 150, formatter: categoryLevelFormatter},
            {
                label: '上级分类', width: 250, formatter: function () {
                    // 通过修改变量刷新上级分类
                    return parentCategory;
                }
            },
            {label: '分类名称', name: 'categoryName', width: 250},
            {label: '状态', name: 'isDeleted', formatter: isDeletedFormatter},
        ],
        cmTemplate: {align: 'center'}, // 设置列的默认对齐方式为居中
        autowidth: true, // 填充宽度到父容器
        height: 500,
        styleUI: 'Bootstrap', // 使用Bootstrap样式渲染表格
        multiselect: true, // 启用多选模式，允许用户选择多行
        rowNum: 10, // 指定初始每页显示的行数为10行
        rowList: [10, 20, 50], // 设置用户可以选择的每页行数选项
        emptyrecords: '无记录（可刷新重试）',

        url: '/admin/petCategories/list',
        datatype: 'json',
        postData: {
            parentId: 0,
        },
        jsonReader: {
            root: 'data.list',
            total: 'data.totalPage',
            records: 'data.totalCount',
        },

        pager: "#jqGridPager", // 指定分页栏的容器，分页栏的内容将显示在具有该ID的元素中
        // 定义分页事件处理函数
        onPaging: function (pgButton) {
            // 检查用户点击的按钮是否是 "user"，即跳转按钮
            if (pgButton === 'user') {
                let pageInput = $(".ui-pg-input", "#gbox_" + this.id); // 获取页码输入框
                let pageValue = pageInput.val(); // 获取输入框中的值
                // 判断页码合理
                if (pageValue > $(this).jqGrid('getGridParam', 'lastpage')) {
                    pageInput.val($(this).jqGrid('getGridParam', 'lastpage'));
                }
            }
        },
    });

    // 窗口变化时调整宽度
    $(window).resize(function () {
        $("#jqGrid").setGridWidth($(".card-body").width());
    });

    // 增加确认按钮监听，不用防重复，因为点击就隐藏model
    $('#save').click(function () {
        var categoryName = $('#newCategoryName').val();
        if (isEmpty(categoryName)) {
            toastr.warning('分类名不能为空！', '警告', {timeOut: 5000});
            return;
        }
        var data = {
            parentId: parentId,
            categoryLevel: categoryLevel,
            categoryName: categoryName
        };
        $.ajax({
            type: 'POST',
            contentType: "application/json", // 用json了一定要这个
            url: '/admin/petCategories/save',
            data: JSON.stringify(data),
            success: function (result) {
                if (result.statusCode === 200) {
                    toastr.success('增加成功！', {timeOut: 3000});
                    $("#jqGrid").trigger("reloadGrid");
                } else {
                    toastr.error(result.message, {timeOut: 3000});
                }
            }
        });
    });

    // 编辑按钮监听
    $('#edit').click(function () {
        // 获取选中行的行号数组
        var selectedRows = $("#jqGrid").jqGrid('getGridParam', 'selarrrow');
        if (selectedRows.length === 0) {
            toastr.warning('未选中记录！', '警告', {timeOut: 5000});
            return;
        } else if (selectedRows.length > 1) {
            toastr.warning('只能同时编辑一个分类！', '警告', {timeOut: 5000});
            return;
        }
        // 获取选中行的数据
        editCategoryData = $("#jqGrid").jqGrid("getRowData", selectedRows[0]);
        // 显示弹框
        $('#modal-edit').modal('show');
        // 设置弹框input里显示原名称
        $('#editCategoryName').val(editCategoryData.categoryName);
    });

    // 编辑确认按钮监听
    $('#editConfirm').click(function () {
        var categoryName = $('#editCategoryName').val();
        if (isEmpty(categoryName)) {
            toastr.warning('分类名不能为空！', '警告', {timeOut: 5000});
            return;
        }
        var data = {
            categoryId: editCategoryData.categoryId,
            parentId: editCategoryData.parentId,
            categoryName: categoryName
        };
        $.ajax({
            type: 'PUT',
            url: '/admin/petCategories/update',
            contentType: "application/json", // 用json了一定要这个
            data: JSON.stringify(data),
            success: function (result) {
                if (result.statusCode === 200) {
                    toastr.success('修改成功！', {timeOut: 3000});
                    $("#jqGrid").trigger("reloadGrid");
                } else {
                    toastr.error(result.message, {timeOut: 3000});
                }
            }
        });
    });

    // 删除确认按钮监听
    $('#delete').click(function () {
        var selectedRows = $("#jqGrid").jqGrid('getGridParam', 'selarrrow');
        if (selectedRows.length === 0) {
            toastr.warning('未选中记录！', '警告', {timeOut: 5000});
            return;
        }
        $.ajax({
            type: 'PUT',
            url: '/admin/petCategories/delete',
            contentType: "application/json", // 用json了一定要这个
            data: JSON.stringify(selectedRows),
            success: function (result) {
                if (result.statusCode === 200) {
                    toastr.success('删除成功！', {timeOut: 3000});
                    $("#jqGrid").trigger("reloadGrid");
                } else {
                    toastr.error(result.message, {timeOut: 3000});
                }
            }
        });
    });

    // 上级分类按钮监听
    $('#previousCategory').click(function () {
        $(this).attr('disabled', true);
        // 判断是否有上级分类
        if(categoryLevel === 1){
            toastr.warning('无上级分类！', '警告', {timeOut: 5000});
            $(this).attr('disabled', false);
            return;
        }
        // 修改参数刷新表格
        parentId = firstParentId; // 父id -> 上一个的id
        parentCategory = '无'; // 父分类名 -> 上一个的名
        categoryLevel--; // 分类等级-1
        // 刷新表格
        $("#jqGrid").jqGrid('setGridParam', {page: 1}); // 从第一页开始
        $("#jqGrid").jqGrid('getGridParam', 'postData').parentId = parentId; // 这个只能手动修改
        $("#jqGrid").trigger("reloadGrid");
        $(this).attr('disabled', false);
    });

    // 下级分类按钮监听
    $('#nextCategory').click(function () {
        $(this).attr('disabled', true);
        // 判断选中
        var selectedRows = $("#jqGrid").jqGrid('getGridParam', 'selarrrow');
        if (selectedRows.length === 0) {
            toastr.warning('未选中记录！', '警告', {timeOut: 5000});
            $(this).attr('disabled', false);
            return;
        } else if (selectedRows.length > 1) {
            toastr.warning('只能选中一个分类！', '警告', {timeOut: 5000});
            $(this).attr('disabled', false);
            return;
        }
        // 判断是否有下级分类
        if(categoryLevel === 2){
            toastr.warning('无下级分类！', '警告', {timeOut: 5000});
            $(this).attr('disabled', false);
            return;
        }
        // 获取选中行的数据
        editCategoryData = $("#jqGrid").jqGrid("getRowData", selectedRows[0]);
        // 修改参数刷新表格
        parentId = editCategoryData.categoryId; // 父id -> 选中的id
        parentCategory = editCategoryData.categoryName; // 父分类名 -> 选中的名
        categoryLevel++; // 分类等级+1
        // 刷新表格
        $("#jqGrid").jqGrid('setGridParam', {page: 1}); // 从第一页开始
        $("#jqGrid").jqGrid('getGridParam', 'postData').parentId = parentId; // 这个只能手动修改
        $("#jqGrid").trigger("reloadGrid");
        $(this).attr('disabled', false);
    });
});

function categoryLevelFormatter(cellvalue) {
    switch (cellvalue) {
        case 1:
            return '一';
        case 2:
            return '二';
        default:
            return '未定义';
    }
}

function isDeletedFormatter(cellvalue) {
    if (cellvalue === 0) {
        return '<span style="color: #28a745">' + '正常' + '</span>';
    } else {
        return '<span style="color: #bd2130">' + '删除' + '</span>';
    }
}